<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:composition template="../template.xhtml">
        <ui:define name="title">
            <h:outputText value="#{rol.TituloEditar}"></h:outputText>
        </ui:define>
        <ui:define name="body">
            <h:form id="frmEditar">
                <p:panel style="font-size: small">
                    <p:accordionPanel>
                        <p:tab title="Editar rol">
                            <h:inputHidden value="#{rolController.selected.id}"/>
                            <table width="545" border="0" >
                                <tr>
                                    <th align="right" scope="row">
                                        <p:outputLabel value="#{rol.Nombre}:"/>
                                    </th>
                                    <td width="500">
                                        <p:inputText style="width: 200px" id="txtNombreRol" value="#{rolController.selected.nombre}" 
                                                     title="#{rol.Nombre}" required="true" requiredMessage="#{rol.CampoNombre}"
                                                     onkeyup="value=value.toUpperCase();"/>
                                    </td>
                                    <td>
                                        <p:message for="txtNombreRol" />
                                    </td>
                                </tr>

                                <tr>
                                    <th align="right" scope="row">
                                        <p:outputLabel value="#{rol.Descripcion}:"/>
                                    </th>
                                    <td width="500">
                                        <p:inputTextarea style="width: 200px" value="#{rolController.selected.descripcion}"/>
                                    </td>
                                </tr>
                                <tr>
                                    <th align="right" scope="row">
                                        <p:outputLabel value="#{rol.Estado}:"/>
                                    </th>
                                    <td>
                                        <p:selectBooleanCheckbox value="#{rolController.selected.estado}"/>
                                    </td>
                                </tr>
                            </table>

                        </p:tab>
                        <br/>
                        <p:tab title="Asignar accion a roles">

                            <table border="1" style="width: 100%; font-size: small" class="detalle">
                                <ui:repeat value="#{permisoController.getPermisosByRolId(rolController.selected.id)}" var="permiso">
                                    <tr>
                                        <th align="left">
                                            <p:outputLabel value="#{permiso.nombre}"/>
                                        </th>
                                        <ui:repeat value="#{accionController.getAccionByIdPermiso(permiso.id)}"
                                                   var="accion">
                                            <td>                                        
                                                <div class="ui-chkbox ui-widget">   
                                                    <ui:fragment rendered="#{accionRolController.findAByIdRolIdAccion(rolController.selected.id, accion.id)==null}">
                                                        <input type="checkbox" value="#{accion.id}"
                                                               name="accionesSeleccionadas"/><label>#{accion.nombre}</label>
                                                    </ui:fragment>
                                                    <ui:fragment rendered="#{accionRolController.findAByIdRolIdAccion(rolController.selected.id, accion.id)!=null}">
                                                        <input type="checkbox" value="#{accion.id}" checked="checked"
                                                               name="accionesSeleccionadas"/><label>#{accion.nombre}</label>
                                                    </ui:fragment>
                                                </div> 
                                            </td>
                                        </ui:repeat>
                                    </tr>
                                </ui:repeat>
                            </table>
                        </p:tab>
                    </p:accordionPanel>
                    <br/>
                    <div style="font-size: x-small">
                        <p:commandButton action="#{rolController.editarRol()}" ajax="false" value="Guardar">
                            <f:param name="rolId" value="#{rolController.selected.id}" />
                        </p:commandButton>
                    </div>
                    <br />
                    <p:commandLink  style="font-size: x-small" action="#{rolController.cargarDetalleEditarRol(rolController.selected.id)}" 
                                    value="#{rol.Detalle}" ajax="false"
                                    rendered="#{accionController.getAccionByVista('Rol', 'Ver')}"/>
                    <br />
                    <h:link style="font-size: x-small" outcome="Index" value="#{rol.RegresarIndex}"/>
                    <br />
                </p:panel>
            </h:form>
        </ui:define>
    </ui:composition>

    <script type="text/javascript">
        $(document).ready(function() {
            $("#frmEditar").submit(function() {
                return confirm("¿Está seguro de guardar los cambios?");
            });
        });
    </script>
</html>

